<template>
	<view class="viewbox auto m-top10 bor_radius_10" v-if="pageData">
		<swiper class="siwper" 
		        :indicator-dots="true" 
				indicator-color="#ccc"
				:indicator-active-color="color"
				:autoplay="true" 
				circular 
				:interval="5000" 
				:duration="2000">
			<swiper-item v-for="(item,index) in pageData.list" :key="index" @click="$PageUrl(item)">
				<image :src="$imgUrls(item.img)" mode="aspectFill" class="imgs"></image>
			</swiper-item>
			
		</swiper>
	</view>
</template>

<script>
	import {mapState} from 'vuex';
	export default {
		name:"Bannel",
		props:['pageData'],
		data() {
			return {
				
			};
		},
		computed:{
			...mapState(['color']),
		}
	}
</script>

<style lang="scss" scoped>
	.siwper{
		width:100%;
		height: 345rpx;
		box-sizing: border-box;
		border-radius: 12rpx;
		overflow: hidden;
		transform: translateY(0);
		swiper-item{
			width:100%;
			height: 100%;
			box-sizing: border-box;
		}
	}
	.imgs{
		width:100%;
		height: 100%;
	}
	
</style>